import React from 'react'
import PropTypes from 'prop-types';
export default class ContactDetails extends React.Component{
    constructor(props) {
        super(props);
        this.state = {}
    }
    static getDerivedStateFromProps(nextProps) {
        let contactList = nextProps.contactData
        return {
            contactList
        }
    }
    render() {
        return(
            <div className='contact_details'>
                {/*面包屑*/}
               <div className='bread_crumbs'>
                   <span>高品</span>
                   <span> > </span>
                   <span>联系我们</span>
               </div>
                {/*联系列表*/}
                {
                    this.state.contactList &&
                    <ul className='contact_list'>
                        <li className='contact_list_item'>
                            <img src="/static/aboutImg/phone@2x.png" alt=""/>
                            <span>客服热线</span>
                            <span>{this.state.contactList.customer_service_tel}</span>
                        </li>
                        <li className='contact_list_item'>
                            <img src="/static/aboutImg/qq@2x.png" alt=""/>
                            <span>QQ</span>
                            <span>{this.state.contactList.company_qq}</span>
                        </li>
                        <li className='contact_list_item'>
                            <img src="/static/aboutImg/youxiang@2x.png" alt=""/>
                            <span>公司邮箱</span>
                            <span>{this.state.contactList.company_email}</span>
                        </li>
                        <li className='contact_list_item'>
                            <img src={this.state.contactList.wechat_official_account}  alt=""/>
                            <span>微信公众号</span>
                        </li>
                    </ul>
                }

            </div>
        )
    }
}

ContactDetails.propTypes = {
    contactData:  PropTypes.object
}
